<template>
	<y-popup mode="bottom" backgroundColor="#fff" round="12" ref="cdkeyPopup">
		<view class="p-18 text-black ">
			<view class="text-center fs-20 fw-600 ">卡密兑换</view>
			<view class="  round-12 mt-20 px-12 py-16" style="background-color: #F2F3F5;">
				<input placeholder="请输入您的卡密兑换码" v-model="code" />
			</view>
			<view class="mt-20 gradient text-white text-center round-12 py-14" @click="cdkey">
				确认兑换
			</view>
		</view>
		<view @click="cdkeyPopup.close()"
			class=" w-30 h-30 text-grey-1 round-circle flex flex-center absolute right-10 top-18"
			style="background: rgba(116,116,128,0.08);;">
			<text class="iconfont icon-guanbi text-333 fs-14 fw-600"></text>
		</view>
	</y-popup>
</template>

<script setup>
	import { ref } from 'vue';
	import { useRefs, useUserStore } from '@/stores'
	import { $http, $tool } from '@/utils';
	const { getUserInfo } = useUserStore();

	const cdkeyPopup = ref(null)

	const open = () => {
		cdkeyPopup.value.open()
	}
	const code = ref('')
	const cdkey = () => {
		uni.showLoading({
			title: '兑换中...'
		})
		$http.post('Cdkey/cdkey', { code: code.value }).then(res => {
			$tool.toast('兑换成功');
			cdkeyPopup.value.close();
			code.value = ''
			getUserInfo()
		})
	}

	defineExpose({ open })
</script>

<style>
</style>